<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>地震局培训平台</title>
		<!--<link rel="stylesheet" href="bootstrap/css/bootstrap.css" />-->
		<link rel="stylesheet" href="style/main.css" />
		<link rel="stylesheet" href="style/news.css" />
	</head>

	<body>
		<div id="info">
			<div class="info">
				<div class="newsbox">
					<!--消息滚动-->
					<div class="news nowrap">消息：欢迎加入地震应急志愿者培训平台，您是第123456位访问用户。</div>
				</div>
				<div class="infobox">
					<div class="name nowrap">zhangming</div>
					<div class="info_id nowrap">N.8784547</div>
					<div class="sign_out">退出</div>
				</div>
				<div class="leave_m">互动留言</div>
			</div>
		</div>
		<div id="show">
			<nav id="nav">
				<div class="top">
					<div class="logo"></div>
					<div class="seachbox">
						<input type="text" id="search" value="在线课堂搜索" />
						<div class="weibo codeIcon">
							<div class="first">
								<img src="image/weiboCode.png" />
							</div>
						</div>
						<div class="weixin codeIcon">
							<div class="first">
								<img src="image/weixinCode.png" />
							</div>
						</div>
					</div>
				</div>
				<div class="border">
					<ul class="nav">
						<li data-url="index">首页</li>
						<li class="in" data-url="news">新闻资讯</li>
						<!--<li data-url="story">志愿故事</li>-->
						<li class="team">志愿品牌
							<div class="first">
								<div class="in" data-url="story">志愿故事</div>
								<div data-url="team">志愿团体</div>
								<div data-url="star">志愿之星</div>
							</div>
						</li>
						<!--<li data-url="project">志愿项目</li>
						<li data-url="star">志愿之星</li>-->
						<li data-url="train">培训平台</li>
						<li data-url="policy">志愿政策</li>
					</ul>
				</div>
			</nav>
			<!-- 热点新闻 -->
			<div id="news">
				<div class="titlebox">
					<div class="border"></div>
					<div class="title"></div>
					<div class="more">更多>></div>
				</div>

				<div class="left">
					<div class="h_enterbtn"></div>
				</div>
				<ul class="list hot_news">
					<!-- <li>
						<div class="text nowrap">北京市大兴区开展2018年应急避难设施建设实施方案评审工作</div>
						<div class="time">2018-04-10</div>
					</li> -->
					
					
					
					
				</ul>
			</div>
            <!-- 志联动态 -->
			<div id="news2">
				<div class="news1">
					<div class="titlebox">
						<div class="border"></div>
						<div class="title"></div>
						<div class="more more2">更多>></div>
					</div>
					<div class="trendsbox">
						
<!-- 						<div class="box box1">
							<div class="img"></div>
							<div class="text">“爱满京城”学雷锋</div>
							<div class="text">新华社：志愿服务主题推动日</div>
						</div>
						<div class="box">
							<div class="img"></div>
							<div class="text">“爱满京城”学雷锋</div>
							<div class="text">新华社：志愿服务主题推动日</div>
						</div> -->
						
					</div>
				</div>
				<!-- 志愿快讯 -->
				<div class="right">
				<div class="news2" id="news3">
					<div class="titlebox">
						<div class="border"></div>
						<div class="title"></div>
						<div class="more more3">更多>></div>
					</div>
					<ul class="list quick_news">
						
					</ul>
				</div>
				<!-- 媒体报道 -->
				<div class="news3" id="news4">
					<div class="titlebox">
						<div class="border"></div>
						<div class="title"></div>
						<div class="more more4">更多>></div>
					</div>
					<ul class="list media_news">
						
					</ul>
				</div>
				</div>
				

			</div>

		</div>
		<div id="bottom">
			<ul class="border">
				<li>相关协作单位：</li>
				<li>中国红十字会</li>
				<li>中科院心理所</li>
				<li>中国地震信息网</li>
				<li>中国地震科普网</li>
				<li>北京市地震局科普网 </li>
				<li>科普网</li>
			</ul>
			<div class="bottom">
				<ul class="one">
					<li>设为首页</li>
					<li>交换链接</li>
					<li>关于我们</li>
					<li>联系我们</li>
					<li>常见问题</li>
					<li>心理教室</li>
					<li>党团建设</li>
				</ul>
				<ul class="two">
					<li>主办：北京市地震局</li>
					<li>版权所有 京ICP备08988239</li>
					<li>技术支持：中宣助力传媒</li>
				</ul>
			</div>
		</div>

		<script type="text/javascript" src="script/jquery.min.js"></script>
		<script type="text/javascript" src="script/ishoock.tools.js"></script>
		<script type="text/javascript" src="script/main.js"></script>
		<script type="text/javascript" src="script/common.js"></script>
		<script>
			$(function(){
				$(".list li").on("mouseover", function() {
					$(this).in();
				});
				$(".list li").on("mouseleave", function() {
					$(".list li").removeIn();
				});
				$(".list li").on("click", function() {
					window.location.href="details.html";
				});
				$(".news1 .box").on("click", function() {
					window.location.href="details.html";
				});
				
				//点击"点击进入"按钮
				$("#news .left").on("click",function(){
					window.location.href="bigLecturer.html";
				});
				//图片放大
				$("#news .left").on("mouseover",function(){
					$(this).in();
				});
				$("#news .left").on("mouseleave",function(){
					$("#news .left").removeIn();
				});
				$("#news2 .trendsbox .img").on("mouseover",function(){
					$(this).in();
				});
				$("#news2 .trendsbox .img").on("mouseleave",function(){
					$("#news2 .trendsbox .img").removeIn();
				});
				//点击更多按钮
// 				$(".titlebox .more").on("click",function(){
// 					window.location.href="newsList.html";
// 				});
				
				//获取热点新闻数据
				$.ajax({
					type: "GET",
					url: host +"news/getNewsInfo?newsType=8&pageSize=5&page=1",
					dataType: "json",
					success: function(data){
						
						$.each(data.result,function(index,item){
						    var createDate = item.createDate.substr(0, 10)
							
							  $('.hot_news').append('<li>'+
							                            '<input type="hidden" value="'+item.id+'" class="Id">'+
														'<div class="text nowrap">'+item.title+'</div>'+
														'<div class="time">'+createDate+'</div>'+
													'</li> ')
													
						})
						
						$(".hot_news").on("click","li", function () {
							var Id = $(this).children('.Id').val();
							window.location.href = "details.html?id="+Id;
						});
						
						$('#news ').on("click",".more",function(){
							window.location.href="newsList.html?id=8";
						});
						
					},
				})
				
				//获取志联动态数据
				$.ajax({
					type: "GET",
					url: host +"news/getNewsInfo?newsType=9&pageSize=6&page=1",
					dataType: "json",
					success: function(data){
						console.log(data.result)
						$.each(data.result,function(index,item){
							$('.trendsbox').append('<div class="box">'+
							                            '<input type="hidden" value="'+item.id+'" class="Id">'+
														'<div class="img"><img src="'+item.imageUrl+'" /></div>'+
														'<div class="text">'+item.title+'</div>'+
													'</div> ')
													
						})
						
						$(".trendsbox").on("click",".box", function () {
							var Id = $(this).children('.Id').val();
							window.location.href = "details.html?id="+Id;
						});
						
						$('.more2 ').on("click",function(){
							window.location.href="newsList.html?id=9";
						});
						
					},
				})
				
				
				
				//获取志愿快讯数据
				$.ajax({
					type: "GET",
					url: host +"news/getNewsInfo?newsType=10&pageSize=9&page=1",
					dataType: "json",
					success: function(data){
						$.each(data.result,function(index,item){
							var createDate = item.createDate.substr(0, 10)
							
							$('.quick_news').append('<li>'+
														'<input type="hidden" value="'+item.id+'" class="Id">'+
														'<div class="text nowrap">'+item.title+'</div>'+
														'<div class="time">'+createDate+'</div>'+
													'</li> ')
													
						})
						
						$(".quick_news").on("click","li", function () {
							var Id = $(this).children('.Id').val();
							window.location.href = "details.html?id="+Id;
						});
						$('.more3').on("click",function(){
							window.location.href="newsList.html?id=10";
						});
					},
				})
				
				//获取媒体报道数据
				$.ajax({
					type: "GET",
					url: host +"news/getNewsInfo?newsType=11&pageSize=3&page=1",
					dataType: "json",
					success: function(data){
						$.each(data.result,function(index,item){
							var createDate = item.createDate.substr(0, 10)
							
							$('.media_news').append('<li>'+
														'<input type="hidden" value="'+item.id+'" class="Id">'+
														'<div class="text nowrap">'+item.title+'</div>'+
														'<div class="time">'+createDate+'</div>'+
													'</li> ')
													
						})
						
						$(".media_news").on("click","li", function () {
							var Id = $(this).children('.Id').val();
							window.location.href = "details.html?id="+Id;
						});
						
						$('.more4').on("click",function(){
							window.location.href="newsList.html?id=11";
						});
						
					},
				})
				
				
				
			});
		</script>
	</body>

</html>